<template>
    <div>
        <Tabs value="leader" type="card" :animated="true">
            <TabPane label="小组审批监测" icon="md-stats" name="leader"
                     :linkOption="{component:'projects/afs-core-business/pages/case/approve/aging-monitor/leader-monitor',
                                 isFull:true,pageTitle:'小组审批监测'}">
                <Spin fix size="large" v-if="loading">
                    <slot name="loading"></slot>
                </Spin>
                <aging-monitor :data-list="dataList" :type="type">
                    <div slot="header">
                        <Alert><b>小组审批监测</b><Button icon="md-refresh" ghost type="primary" @click="refresh" style="margin:5px"></Button></Alert>
                    </div>
                </aging-monitor>
            </TabPane>
        </Tabs>
    </div>
</template>

<script>
    import {listByLeader} from "../../../../api/afs-case/aging-monitor/agingMonitor";
    import AgingMonitor from "./aging-monitor";

    export default {
        name: "leader-monitor",
        components: {AgingMonitor},
        data(){
            return {
                dataList: [],
                type:"leader",
                loading:false
            }
        },
        methods:{
            queryMonitorByLeader(){
                this.loading = true;
                listByLeader().then(res=>{
                    this.dataList = res.data;
                }).finally(()=>{
                    this.loading = false;
                })
            },
            refresh(){
                this.queryMonitorByLeader();
            }
        },
        mounted(){
            this.queryMonitorByLeader();
        },
    }
</script>

<style scoped>

</style>
